<template>
  <div id="">
    <div class="p10">
      <house :houseInfo="houseInfo" :houseHeaderImg="houseHeaderImg"></house>
    </div>
    <p class="tipTxt">入住人信息</p>
    <ul class="releaseForm">
      <li>
        <span>姓名</span>
        <div class="rightForm">
          <input type="text" name="" v-model="name" maxlength="5" placeholder="请输入姓名,最多5个字">
          <!-- <img src="@/assets/images/right-icon@2x.png" width="10" alt=""> -->
        </div>
      </li>
      <li>
        <span>性别</span>
        <div class="">
          <!-- <mt-switch v-model="sex"></mt-switch> -->
          <span class="switchSpan" :class="{'lightBg':sex==0}" @click="switchSex">
            <em :style="{float:switchLeft}"></em>
            <i v-if="sex==1">女士</i>
            <i v-else>男士</i>
          </span>
        </div>
      </li>
      <li v-if="houseInfo.rentType==2">
        <span>入住日期</span>
        <div class="rightForm" @click="chooseStartdate">
          <input type="text" v-model="startDate" readonly placeholder="请选择入住日期">
          <!-- <img src="@/assets/images/right-icon@2x.png" width="10" alt=""> -->
        </div>
      </li>
      <li v-if="houseInfo.rentType==2" @click="chooseStartdate">
        <span>离开日期</span>
        <div class="rightForm">
          <input type="text" v-model="leaveDate"  readonly placeholder="请选择离开日期">
          <!-- <img src="@/assets/images/right-icon@2x.png" width="10" alt=""> -->
        </div>
      </li>
      <li>
        <span>身份证号码</span>
        <div class="rightForm">
          <input type="text" name="" v-model="idCard" placeholder="请输入身份证号码">
          <!-- <img src="@/assets/images/right-icon@2x.png" width="10" alt=""> -->
        </div>
      </li>
      <li>
        <div class="pt10" style="width:100%;">
          <span class="formTit mb10">身份证照片</span>
          <div class="imgUploader">
            <div class="uploaderDiv">
              <mo-upload flag="'thumbnail'" @complete="uploadComplete" class="moupload">
                <!-- <img :src="idCardPic1" alt="" class="uploadImg"> -->
                <div class="" class="uploadImg" :style="{backgroundImage:'url(' + idCardPic1 + ')'}"
                >
                </div>
              </mo-upload>
              <p class="mt10">正面</p>
            </div>
            <div class="uploaderDiv">
              <mo-upload flag="'thumbnail'" @complete="uploadComplete2" class="moupload">
                <!-- <img :src="idCardPic2" alt="" class="uploadImg"> -->
                <div class="" class="uploadImg" :style="{backgroundImage:'url(' + idCardPic2 + ')'}"
                >
                </div>
              </mo-upload>
              <p class="mt10">反面</p>
            </div>
          </div>
        </div>
      </li>
      <li>
        <span>联系电话</span>
        <div class="rightForm">
          <input type="text" name=""
          v-model="mobile" maxlength="11"
          v-on:input="iptMobile" placeholder="请输入11位有效手机号码">
        </div>
      </li>
      <li v-if="inviteMobile!=''">
        <span>推荐人电话</span>
        <div class="rightForm">
          <input type="text" name="" readonly
          v-model="inviteMobile" style="color:#999;">
        </div>
      </li>

      <li v-show="difMobile">
        <span>验证码</span>
        <div class="rightForm">
          <input type="text" name="" v-model="yzmCode" placeholder="输入验证码" style="width:50%;">
          <button type="button" name="button" class="btn" v-if="isGetYzmTime">发送({{yzmTime}}s)</button>
          <button type="button" name="button" class="inlineBtn" v-else @click="getYzm">获取验证码</button>
        </div>
      </li>
    </ul>

    <div class="fixedBottom">
      <button type="button" name="button" class="blockBtn" @click="submitSignContact">提交签约</button>
    </div>
    <mt-popup
      v-model="showCalendar"
      position="right" style="width:100%; height:100%;">
      <!-- <calendar @returnTime='returnTime'></calendar> -->
      <rentTime :dateToolsKey="2"　
      ref="topDateTools2"　　　　
      :trainDateFullList="trainDateFullList"　　
      @rentTimeEvent="rentTimeEvent"></rentTime>
    </mt-popup>

  </div>
</template>
<script src="./signContact.js"></script>
<style lang="scss" scoped src="./signContact.scss"></style>
